
<!doctype html>
<html lang="en">
<head>
	<meta charset="UTF-8">
	<meta name="description" content="网易教育产品部帮助你改变未来，遇见更好的自己，设有云课堂微专业，帮助你掌握专业技能；设有网易公开课，汲取属于全人类的知识和智慧；设有中国大学MOOC，在家也可以上名校！">
    <meta name="keywords" content="云课堂，微专业，公开课，网易公开课，网易教育，在线教育，中国大学慕课，中国大学MOOC，教育产品，在家读大学">
	<link rel="stylesheet" href="css/edu.css">
	<title>网易教育产品部</title>
</head>
<body> 
	<div id="wrapper">
        
        <div class="login-area mask">
            <div class="login-content">
                <div class="close-btn"></div>
                <form>
                    <h3>登录网易云课堂</h3>
                    <input id="account" type="text" placeholder="账号">
                    <input id="pwd" type="password" placeholder="密码">
                    <div id="submit-btn">登录</div>
                </form>
            </div>
        </div>
        <div class="prompt-bar">
            <div class="prompt-bar-content">
                <p>网易云课堂微专业，帮助你掌握专业技能，令你求职或加薪多一份独特优势！  
                    <span><a href="http://study.163.com/smartSpec/intro.htm">立即查看></a></span>
                </p>
                <div class="no-more-prompt">不再提醒</div>
            </div>            
        </div>
        <div class="header">
            <div class="header-content">
                <h1 class="logo"><span class="en-name">EDU</span>网易教育产品部</h1>
                <div class="follow-fans-area">
                    <div class="follow-btn"><span>+ 关注</span></div>
                    <div class="cancel-follow-btn-area"><span>已关注</span><span class="cancel-follow-btn">取消</span></div>
                     <div class="fans-num-area">粉丝<span class="num-of-fans">45</span></div>
                </div>
                <ul class="products-link-list">
                    <li><a href="http://open.163.com/">网易公开课</a></li>
                    <li><a href="http://study.163.com/">网易云课堂</a></li>
                    <li><a href="http://www.icourse163.org/">中国大学MOOC</a></li>
                    <li><a href=""><img src="img/seach.jpg" alt=""></a></li>
                </ul>
            </div>
        </div>
        <div class="Slideshow-area">
            <ul class="Slideshow-indicators">
                <li data-slide-to="0"></li>
                <li data-slide-to="1"></li>
                <li data-slide-to="2"></li>
            </ul>
            <ul class="Slideshow-images">
                <li class="Slideshow-item"><img src="./img/banner1.jpg"></li>
                <li class="Slideshow-item"><img src="./img/banner2.jpg"></li>
                <li class="Slideshow-item"><img src="./img/banner3.jpg"></li>
            </ul>
        </div>
        <div class="products-intro-area">
            <ul class="products-intro-list">
                <li class="open">
                    <div class="intro-area">
                        <h3>网易公开课</h3>
                        <p>推出国内外名校公开课，涉及广泛的学科，名校老师认真讲解深度剖析，网易视频公开课频道搭建起强有力的网络视频教学平台。</p>
                        <a href="http://open.163.com/">了解更多 ></a>
                    </div>
                </li>
                <li class="study">
                    <div class="intro-area">
                        <h3>网易云课堂</h3>
                        <p>网易旗下大型在线学习平台，该平台面向学习者提供海量免费、优质课程,创新的个性化学习体验，自由开放的交流互动环境。</p> 
                        <a href="http://study.163.com/">了解更多 ></a>
                    </div>
                </li>
                <li class="mooc">
                    <div class="intro-area">
                        <h3>中国大学MOOC</h3> 
                        <p>是爱课程网携手云课堂打造的在线学习平台，每一个有提升愿望的人,都可以在这里学习中国最好的大学课程，学完还能获得认证证书。</p>
                        <a href="http://www.icourse163.org/">了解更多 ></a>
                    </div>
                </li>
            </ul>
        </div>
        <div class="images-display-area">
            <img src="img/huanjing1.jpg" alt="1">
            <img src="img/huanjing2.jpg" alt="2">
            <img src="img/huanjing3.jpg" alt="3">
            <img src="img/huanjing4.jpg" alt="4">
            <img class="last-image" src="img/huanjing5.jpg" alt="5">
        </div>
        <div class="content">
            <ul class="tab-btn-area">
                <li class="tab-btn active" data-type="10"><a href="#product-design">产品设计</a></li>
                <li class="tab-btn" data-type="20"><a href="#programming-languege">编程语言</a></li>
            </ul>
            <div class="course-display-area" >
                <ul id="courseArea"></ul>
                <div class="page-nav-area">
                    <ul class="page-nav-btn">
                    </ul>
                </div>
            </div>
            <div class="side-area">
                <div class="institution-intro-area">
                    <h3>机构介绍</h3>
                    <div class="intro-video-thumbnail-area">
                        <p>观看下面的视频来了解吧：</p>
                        <img class="video-thumbnail" src="img/video_play.jpg">
                    </div>
                </div>
                <div class="hot-ranking-area">
                    <h3>最热排行</h3>
                    <ul class="hot-ranking-list">
                    </ul>
                </div>
            </div>
        </div>
        <div class="footer-area" >
            <div class="footer-content">
                <div class="edu-section-info">
                    <h1 class="logo"><span class="en-name">EDU</span>网易教育产品部</h1>
                    <p>©2014 icourse163.org 浙ICP备08114786号-1</p>
                    <p>icourses.cn 京ICP备12020869 京公安网备110102000459-2</p>
                </div>
                <div class="info-list">
                    <dl class="friend-links">
                        <dt>友情链接：</dt>
                        <dd><a href="http://open.163.com/">网易公开课</a></dd>
                        <dd><a href="http://study.163.com/">网易云课堂</a></dd>
                        <dd><a href="http://www.icourse163.org/">中国大学MOOC</a></dd>
                    </dl>
                    <dl class="about-us">
                        <dt>我们：</dt>
                        <dd>关于</dd>
                        <dd>联系</dd>
                        <dd>关注<span class="weibo-icon"></span></dd>
                    </dl>
                    <dl class="more">
                        <dt>更多：</dt>
                        <dd>常见问题</dd>
                        <dd>意见反馈</dd>
                        <dd></dd>
                    </dl>
                </div>
            </div>
        </div>
    </div>
	
	<div class="video-area mask">
            <div class="video-content">
                <div class="close-btn"></div>
                <p>请观看下面的视频</p>
                <video width="900" height="500" controls>
                  <source src="http://mov.bn.netease.com/open-movie/nos/mp4/2014/12/30/SADQ86F5S_shd.mp4" type="video/mp4">
                </video>

            </div>
        </div>
		<div id="footer-last"></div>
	
	 <script src="./js/main.js"></script>
	 <script src="./js/md5.min.js"></script>
	
	 
</body>
</html>